#{extends 'layout.html' /}
#{set title:messages.get('paciente.list.title') /}
#{script 'jquery-ui-1.8.21.custom.min.js'/}
#{script 'jquery.ui.datepicker.js'/}
#{script 'jquery.ui.datepicker-es.js'/}
#{script 'datepicker.js'/}
#{script 'list_paciente.js'/}
#{script 'graficos/jquery.flot.js'/}
#{script 'graficos/jquery.flot.pie.js'/}
<div id="crudList" class="${type.name}">
	
	<h2 id="crudListTitle">${title} 
	
<a href="#"><img class="funciones" alt="&{'estadisticas'}" src="/public/images/icons/funciones/grafico_barras.png" title="&{'estadisticas'}"
	onclick="verEstadisticas();" /></a>
		
		</h2>
	
	
<!-- Creo que no necesitamos más este buscador... si lo necesitan, descomenten	 -->
<!--     <div id="crudListSearch"> -->
<!--         #{crud.search /} -->
<!--     </div> -->
	
	#{if totalCount <= 0}
		<div class="crudFlash flashError">
			&{'paciente.sinPacientes'}
		</div>
	#{/if}
	
	#{if totalCount > 0}
		<div id="crudListTable">
			#{crud.table fields:['nombre', 'paciente.estado', 'paciente.asignarPlanes', 'paciente.desasignar', 'paciente.crearObjetivoManual', 'paciente.enviarComentario']
						, sort: ['nombre']}
				
				#{crud.custom 'nombre'}
					${object.nombre}
				#{/crud.custom}
				
				#{crud.custom 'paciente.email'}
					${object.email}
				#{/crud.custom}
				
				#{crud.custom 'paciente.estado'}
					${object.estadoPaciente.label}
				#{/crud.custom}
				
				#{crud.custom 'paciente.asignarPlanes'}
					#{if object.estadoPaciente.toString().equals("PENDIENTE")}
						<div class="contenedor_funciones">
							<a href="#"><img class="funciones" src="/public/images/icons/funciones/wait.png" title="&{'paciente.asignar.necesitaConfirmacion'}" alt="&{'paciente.asignar.necesitaConfirmacion'}" /></a>
						</div>
					#{/if}
					#{else}
						<div class="contenedor_funciones">
							<a href="@{Pacientes.asignarPacientes(object.id)}"><img class="funciones" src="/public/images/icons/funciones/list_add.png" title="&{'paciente.asignar'}" alt="&{'paciente.asignar'}" /></a>
						</div>
					#{/else}
				#{/crud.custom}

				#{crud.custom 'paciente.crearObjetivoManual'}
					<div class="contenedor_funciones">
						<a href="@{Pacientes.crearObjetivoManual(object.id)}"><img class="funciones" src="/public/images/icons/funciones/list_check.png" title="&{'paciente.crearObjetivoManual'}" alt="&{'paciente.crearObjetivoManual'}" /></a>
					</div>
				#{/crud.custom}
				
				#{crud.custom 'paciente.enviarComentario'}
					<!-- TODO: Nico, solo envio si el estado es confirmado -->
					#{if object.estadoPaciente.toString().equals("CONFIRMADO")}
						<div class="contenedor_funciones">
							<a href="#" onclick="comentario(${object.id});"><img class="funciones" src="/public/images/icons/funciones/email_enviar.png" title="&{'paciente.enviarComentario'}" alt="&{'paciente.enviarComentario'}" /></a>
						</div>
					#{/if}
					#{else}
						<div class="contenedor_funciones">
							<a href="#"><img class="funciones" src="/public/images/icons/funciones/email_no_enviar.png" title="&{'paciente.noEnviarComentario'}" alt="&{'paciente.noEnviarComentario'}" /></a>
						</div>
					#{/else}
				#{/crud.custom}
				
				#{crud.custom 'paciente.desasignar'}
					<div class="contenedor_funciones">
						<a href="#" onclick="desasignarNutricionista(${object.id}, '${object.nombre}');"><img class="funciones" src="/public/images/icons/funciones/inactivo.png" title="&{'paciente.desasignar'}" alt="&{'paciente.desasignar'}" /></a>
					</div>
				#{/crud.custom}
				
			#{/crud.table}
		</div>
	#{/if}
	
</div>

<div id="desasignar-paciente">
	<p>
		<span id="mensaje"></span>
	</p>
</div>

<div id="comentario-paciente">
	<p>
		#{form action:@comentarioNutri(), method:'POST'}
			<input type="hidden" name="pacienteId" id="pacienteId">
			&{'paciente.comentario'}: <br /> <textarea name="comentario" id="comentario" rows="12" cols="45" maxlength="5000"></textarea> 
		#{/form}
	</p>
</div>

<div id="estadisticas" style="display: none;">
	<div id="sparkline" style="width: 500px; height: 325px;"></div>
	<span id="sparkline_data"></span>
	
	<div style="margin-left: 30px">
		<div class="crudField crud_date">
			<label for="fechaInicio" style="width: 70%">
				&{'plan.fechaInicio'}
			</label>
			<input id="fechaInicio" type="text" size="10" />
		</div>
		
		<div class="crudField crud_date">
			<label for="fechaFin" style="width: 70%">
				&{'plan.fechaFin'}
			</label>
			<input id="fechaFin" type="text" size="10" />
		</div>
	</div>
</div>